<cp-navbar (onClickLeft)="onClickLeft()"></cp-navbar>
<div class="error" *ngIf="error">
    <cp-error (reload)="handleReload()"></cp-error>
</div>
<div class="loading" *ngIf="loading">
    <cp-loading></cp-loading>
</div>
<div class="container" *ngIf="!loading && !error">
    <!-- <cp-estate-review></cp-estate-review> -->

    <!-- <div class="tabbar"><cp-tab [items]="items" [itemWidth]="48" [gapWidth]="16"></cp-tab></div> -->
    <div class="slider">
        <Carousel [dots]="false" [infinite]="false" (afterChange)="afterChange($event)">
            <CarouselSlide *ngFor="let item of detail.Photos">
                <div class="item" [queryParams]="{ project: projectID }" routerLink="/workspace/estate/images">
                    <img [src]="item.src" />
                </div>
            </CarouselSlide>
        </Carousel>
        <div class="price-index">
            <div class="price">
                <p class="label">参考均价</p>
                <p class="value">
                    <span class="num">{{ detail.AveragePrice }}</span><span class="unit"> {{ detail.Unit }} </span>
                </p>
            </div>
            <div class="index">
                <p class="label">{{ detail.Photos[currentIndex]['Category'] }}</p>
                <p class="current">{{ currentIndex + 1 }}/{{ detail.Photos.length }}</p>
            </div>
        </div>
    </div>
    <div class="block baseinfo">
        <div class="namebox">
            <p class="name">{{ detail.Name }}</p>
            <div class="tags">
                <div class="tag tag-status" *ngIf="detail.Status">{{ detail.Status | estateSellStatus }}</div>
                <div class="tag tag-type" *ngIf="detail.Property">{{ detail.Property }}</div>
            </div>
        </div>
        <div class="Alias" *ngIf="detail.Alias">别名：{{ detail.Alias }}</div>
        <div class="advantage tags">
            <div class="tag tag-border" *ngFor="let t of detail.Tag">{{ t }}</div>
        </div>
        <div class="common-label-value">
            <div class="list">
                <div class="item">
                    <p class="label2">地址：</p>
                    <p class="value">{{ detail.Address }}</p>
                </div>
                <div class="item">
                    <p class="label2">开盘：</p>
                    <p class="value">{{ detail.OpenDay || '待定' }}</p>
                </div>
            </div>
        </div>
        <div class="oprbar">
            <button class="btn btn-block" [queryParams]="{ project: detail.Id }" routerLink="/workspace/estate/info">
                查看更多信息
            </button>
        </div>
    </div>

    <div class="block activity" *ngIf="detail.PromotionSummary">
        <div class="pubtitle">
            <div class="left">
                最新活动(<span>{{ detail.PromotionSummary.Count }}</span>)
            </div>
            <div class="right" routerLink="/workspace/home/activity" [queryParams]="{ project: detail.Id }">
                <span class="value">查看全部</span> <i class="icon icon-right"></i>
            </div>
        </div>
        <div class="content">
            <div class="oprbox">
                <div class="titlebox">
                    <span class="type">惠</span>
                    <span class="title" *ngIf="detail.PromotionSummary">{{ detail.PromotionSummary.Title }}</span>
                </div>
                <button class="btn" (click)="applyUp(detail.PromotionSummary)">立即报名</button>
            </div>
            <p class="desc">{{ detail.PromotionSummary.Description }}</p>
            <div class="timebox">
                <span class="lefttime">活动时间至{{ detail.PromotionSummary.End }}</span>
                <span class="enroll">
                    <span class="number">{{ detail.PromotionSummary.Join }}</span>人已报名</span>
            </div>
        </div>
    </div>

    <div *ngIf="detail.ArtcleSummarys[0]" class="block news">
        <div class="pubtitle">
            <div class="left">最新动态({{ detail.ArtcleSummarys[0].Count }})</div>
            <div class="right" [queryParams]="{ project: projectID }" routerLink="/workspace/estate/news">
                <span class="value">查看全部</span> <i class="icon icon-right"></i>
            </div>
        </div>
        <div class="content" *ngIf="detail.ArtcleSummarys[0]">
            <cp-estate-news [Title]="detail.ArtcleSummarys[0].Title" [DateTime]="detail.ArtcleSummarys[0].DateTime"
                [Description]="detail.ArtcleSummarys[0].Description"></cp-estate-news>
        </div>
    </div>

    <div *ngIf="detail.ArtcleSummarys[1]" class="block test">
        <div class="pubtitle">
            <div class="left">楼盘评测({{ detail.ArtcleSummarys[1].Count }})</div>
            <div class="right" [queryParams]="{ project: projectID }" routerLink="/workspace/estate/estateEvaluating">
                <span class="value">查看全部</span> <i class="icon icon-right"></i>
            </div>
        </div>
        <div class="content" [queryParams]="{ project: projectID }" routerLink="/workspace/estate/estateEvaluating">
            <img src="{{ detail.ArtcleSummarys[1].Photo }}" />
            <p class="txt">{{ detail.ArtcleSummarys[1].Description }}</p>
        </div>
    </div>

    <div class="block type">
        <div class="pubtitle">
            <div class="left">主力户型({{ detail.LayoutSummarys.length }})</div>
            <div class="right" [queryParams]="{ project: projectID }" routerLink="/workspace/estate/type">
                <span class="value">查看全部</span> <i class="icon icon-right"></i>
            </div>
        </div>
        <div class="content">
            <div class="list">
                <div class="item" *ngFor="let item of detail.LayoutSummarys">
                    <cp-estate-type1 [queryParams]="{ layout: item.Id }" routerLink="/workspace/estate/typeDetail"
                        [item]="item"></cp-estate-type1>
                </div>
            </div>
        </div>
    </div>

    <div class="block comment" *ngIf="detail.CommentSummary">
        <div class="pubtitle">
            <div class="left">楼盘点评({{ detail.CommentSummary.ProjectCount }})</div>
            <div class="right" [queryParams]="{ project: projectID }" routerLink="/workspace/estate/comment">
                <span class="value">查看全部</span> <i class="icon icon-right"></i>
            </div>
        </div>
        <div class="content">
            <cp-estate-comment [item]="detail.CommentSummary"></cp-estate-comment>
        </div>
        <div class="oprbar">
            <button class="btn btn-block" (click)="review()">
                <img src="assets/images/HouseDetails/icon_comment.png" /> <span>我要点评</span>
            </button>
        </div>
    </div>

    <div class="block question" *ngIf="detail.QuestionSummary">
        <div class="pubtitle">
            <div class="left">问问大家({{ (detail.QuestionSummary && detail.QuestionSummary.Count) || 0 }})</div>
            <div class="right" [queryParams]="{ project: projectID, name: detail.Name }" routerLink="/workspace/estate/question">
                <span class="value">查看全部</span> <i class="icon icon-right"></i>
            </div>
        </div>
        <div class="content" [queryParams]="{ project: detail.QuestionSummary.Id }" routerLink="/workspace/estate/questionDetail">
            <cp-estate-question [item]="detail.QuestionSummary"></cp-estate-question>
        </div>
        <div class="oprbar">
            <button class="btn btn-block" (click)="questionMe()">
                <img src="assets/images/HouseDetails/icon_question.png" /> <span>我要提问</span>
            </button>
        </div>
    </div>

    <div class="block" *ngIf="detail.Latitude">
        <div class="pubtitle">
            <div class="left">周边配套</div>
            <div class="right" [queryParams]="{ lat:this.mapOption.latng.lat,lng:this.mapOption.latng.lng,name:detail.Name }" routerLink="/workspace/estate/estateQqMap">
                <i class="icon icon-right"></i>
            </div>
        </div>
        <div class="content qqmap">
            <qq-map [options]="mapOption" (redirect)="routerMap($event)"></qq-map>
        </div>
    </div>

    <div class="block around">
        <div class="pubtitle">
            <div class="left">周边楼盘</div>
            <div class="right" routerLink="/workspace/estate/around"><i class="icon icon-right"></i></div>
        </div>
        <div class="content">
            <img src="assets/images/temp/map.png" class="map" />
            <div class="oprbar">
                <div class="item" *ngFor="let item of arroundMatching">
                    <img src="assets/images/HouseDetails/{{ item.icon }}" />
                    <p class="name">{{ item.name }}</p>
                </div>
            </div>
        </div>
    </div>
    <div class="block chart">
        <div class="pubtitle">
            <div class="left">均价走势</div>
        </div>
        <div class="content"></div>
    </div>
    <div class="block estates" *ngIf="detail.ProjectSummarys.length > 0">
        <div class="pubtitle">
            <div class="left">周边楼盘</div>
        </div>
        <div class="content">
            <div class="item" *ngFor="let item of detail.ProjectSummarys" (click)="getEstateDetail(item.Id)">
                <cp-estate-item [activity]="false" [item]="item"></cp-estate-item>
            </div>
        </div>
    </div>
    <cp-oprbar type="project" [id]="detail.Id" [estateStatus]="detail.Status" [phone]="detail.Phone" [projectDispatch]="detail.ProjectDispatch"
        [(favorite)]="detail.Favorite"></cp-oprbar>
</div>

<div *ngIf="Notice.show">
    <cp-popup [maskClick]="true" [(show)]="Notice.show">
        <cp-estate-review [(show)]="Notice.show" [title]="reviewMd.title" (release)="reviewMd.handok($event)"></cp-estate-review>
    </cp-popup>
</div>